<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head> 
<title>无限级下拉菜单</title> 
<style type="text/css"> 
* { 
    padding:0; 
    margin:0; 
} 
body {
     leftmargin:0px; topmargin:0px; marginwidth:0px; marginheight:0px;font-family:"微软雅黑";
}
#navigation, #navigation li ul { 
    list-style-type:none; 
} 
#navigation { 
    font-size:12px;
    margin-left:200px; 
    padding-top: 10px;
} 
#navigation li { 
    float:left; 
    text-align:center; 
    position:relative; 
    width:122px;
} 
#navigation li a:link, #navigation li a:visited { 
    display:block; 
    text-decoration:none; 
    color:#fff; 
    width:122px; 
    height:25px;  
    padding-left:10px; 
    padding-top: 7px;
} 
#navigation li a:hover { 
    color:#fff; 
} 
#navigation li ul li a:hover {
	color:#F4FD09;
    background-image: url(<?= $C->SITE_URL ?>themes/default/imgs/test/test3.png);
	background-repeat: no-repeat;
	background-position: 0px 3px;    
} 
#navigation li ul { 
    display:none; 
    position:absolute; 
    top:34px; 
    left:0; 
    width:122px; 
} 
#navigation li ul li {
    background-image: url(<?= $C->SITE_URL ?>themes/default/imgs/test/test1.png);
    width:122px;
    text-align:left;
    padding-left:10px;
}
#toptitle {
     height: 44px;background-image:url(<?= $C->SITE_URL ?>themes/default/imgs/test/test.jpg);
}
#navigation li ul li ul { 
    display:none; 
    position:absolute; 
    top:0px; 
    left:130px; 
    margin-top:1px; 
    margin-left:3px; 
    width:132px; 
}
</style> 
<script type="text/javascript"> 
function displaySubMenu(li) { 
var subMenu = li.getElementsByTagName("ul")[0]; 
subMenu.style.display = "block"; 
} 
function hideSubMenu(li) { 
var subMenu = li.getElementsByTagName("ul")[0]; 
subMenu.style.display = "none"; 
} 
</script> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head> 
<body> 
<div id="toptitle">
<ul id="navigation"> 
    <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)"> 
        <a href="#" style="background-image: url(<?= $C->SITE_URL ?>themes/default/imgs/test/test.png);background-repeat: no-repeat;height:35px;text-align:left;">
            <span style="padding-left:20px; font-weight: bold;">CEIBS校友</span>
        </a> 
        <ul> 
                <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)"><a href="#" style="padding-left:22px;">妈妈育儿区</a> 
                <ul> 
                            <li style="background-image: url(<?= $C->SITE_URL ?>themes/default/imgs/test/test4.png);width:122px;height:6px;"></li>
                            <li><a href="#" style="padding-left:22px;">1.1.1</a></li> 
                            <li><a href="#" style="padding-left:22px;">1.1.2</a></li> 
                            <li><a href="#" style="padding-left:22px;">1.1.3</a></li> 
                            <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)">
                            <a href="#" style="padding-left:22px;">1.1.4 →</a>
                            <ul> 
                                        <li style="background-image: url(<?= $C->SITE_URL ?>themes/default/imgs/test/test4.png);width:122px;height:6px;"></li>
                                        <li><a href="#" style="padding-left:22px;">1.1.1.1</a></li> 
                                        <li><a href="#" style="padding-left:22px;">1.1.1.2</a></li> 
                                        <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)">
                                        <a href="#" style="padding-left:22px;">1.1.1.3 →</a>
                                        <ul> 
                                                    <li style="background-image: url(<?= $C->SITE_URL ?>themes/default/imgs/test/test4.png);width:122px;height:6px;"></li>
                                                    <li><a href="#" style="padding-left:22px;">1.1.1.3.1</a></li> 
                                                    <li><a href="#" style="padding-left:22px;">1.1.1.3.2</a></li> 
                                                    <li><a href="#" style="padding-left:22px;">1.1.1.3.3</a></li> 
                                                    <li><a href="#" style="padding-left:22px;">1.1.1.3.4</a></li> 
                                                    <li style="background-image: url(<?= $C->SITE_URL ?>themes/default/imgs/test/test2.png);width:122px;height:6px;">
                                        </ul>
                                        </li> 
                                        <li><a href="#" style="padding-left:22px;">1.1.1.4</a></li> 
                                        <li style="background-image: url(<?= $C->SITE_URL ?>themes/default/imgs/test/test2.png);width:122px;height:6px;">
                            </ul>
                            </li> 
                            <li style="background-image: url(<?= $C->SITE_URL ?>themes/default/imgs/test/test2.png);width:122px;height:6px;">
                </ul>
                </li>
                
                <li><a href="#" style="padding-left:22px;">CEIBS校友</a></li> 
                <li><a href="#" style="padding-left:22px;">企业微管理</a></li> 
                <li><a href="#" style="padding-left:22px;">宠物社区</a></li> 
                <li><a href="#" style="padding-left:22px;">车友社区</a></li> 
                <li><a href="#" style="padding-left:22px;">健康医疗区</a></li>
                <li style="background-image: url(<?= $C->SITE_URL ?>themes/default/imgs/test/test2.png);width:122px;height:6px;"></li>
        </ul> 
    </li> 

</ul>
</div> 
<div style="margin-left: 20px;">

</div>
</body> 
</html> 
